* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}


/* 
  重要的层级关系：
    1. 拖拽 unicode-drag-bar zIndex 99
    2. 蒙层 mask-box zIndex 100
    3. 菜单 popover zIndex 101


*/
/** mask-box */
.unicode-mask-box {
  transition: all 0.3s;
  position: absolute;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  z-index: 100;
  display: none;
  background-color: rgba(0, 0, 0, 0.2);
}

/* 右键菜单 样式 */
.unicode-popover {
  transition: all 0.3s;
  background-color: #fff;
  box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);
  width: 220px;
  z-index: 101;
  border-radius: 4px;
  padding: 6px 10px;
}
.unicode-popover-item {
  color: #606266;
  margin: 8px 0;
  padding: 4px 8px;
  display: flex;
  justify-content: space-between;
  cursor: pointer;
}
.unicode-popover-item:hover {
  background-color: #ecf5ff;
}
.unicode-popover-item .shortcut {
  font-size: 12px;
  color: #93a2b3;
}

/* 拖拽条 */
.unicode-drag-bar {
  transition: all 0.3s;
  position: absolute;
  z-index: 99;
  /* background-color: green; */
  --base: 0.5vw;
}
.unicode-drag-bar:hover {
  background-color: rgb(165, 193, 251);
}

/* El-Element 样式覆盖 主要实现换肤 */
.el-tree:focus-visible,
.el-tree-node__content:focus-visible {
  outline: none !important;
}
.el-input__wrapper {
  background-color: var(--t-main-background-color) !important;
  outline: none;
}
.el-input__inner {
  color: var(--t-main-font-color) !important;
}

.el-tree-node__content {
  border-radius: 2px;
}
.el-tabs--border-card {
  background: transparent !important;
  border: none !important;
}
.el-tabs--border-card > .el-tabs__header {
  background-color: transparent !important;
}
.el-tabs--border-card > .el-tabs__header {
  border-bottom: none !important;
}
